Skip to content
// ✅ /src/app/admin/blog/create/page.jsx
"use client";

import { useState } from "react";
import Editor from "@/app/components/Editor";
import { useRouter } from "next/navigation";

export default function CreateBlogPage() {
const router = useRouter();

const [title, setTitle] = useState("");
const [category, setCategory] = useState("");
const [shortDesc, setShortDesc] = useState("");
const [description, setDescription] = useState("");
const [featuredImage, setFeaturedImage] = useState("");
const [gallery, setGallery] = useState([]);

// 🗓️ Generate Date String
const today = new Date().toLocaleDateString("en-US", {
month: "long",
day: "numeric",
year: "2-digit",
});

// 🔄 Handle File Upload
const uploadImage = async (e, isGallery = false) => {
const file = e.target.files[0];
const formData = new FormData();
formData.append("file", file);
const res = await fetch("/api/upload", {
method: "POST",
body: formData,
});
const data = await res.json();
if (data.success) {
if (isGallery) {
setGallery([...gallery, data.url]);
} else {
setFeaturedImage(data.url);
}
}
};

const handleSubmit = async (e) => {
e.preventDefault();

const res = await fetch("/api/blog", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
date: today,
adminName: "Admin", // ⚠️ Change if using auth
title,
category,
shortDesc,
content: description, // ✅ renamed
featuredImage,
gallery,
}),
});

if (res.ok) {
router.push("/admin/blog");
} else {
alert("Blog submission failed");
}
};

return (
<div className="blog-form">
<h1>Create Blog</h1>
<form onSubmit={handleSubmit}>
<input
type="text"
placeholder="Title"
value={title}
onChange={(e) => setTitle(e.target.value)}
className="input"
/>

<input
type="text"
placeholder="Category"
value={category}
onChange={(e) => setCategory(e.target.value)}
className="input"
/>

<textarea
placeholder="Short Description"
value={shortDesc}
onChange={(e) => setShortDesc(e.target.value)}
className="input"